import React, { Component } from 'react';
import { Scroller, Touchable } from '$yo-component';
import Header from '$component/header/index.js';
import yoHistory from '$common/history';
import './index.scss';
import List from '../list';
import linkList from '$component/linkList/index.js';

class DetailPage extends Component {
    constructor() {
        super();
        this.state = {
            s_title:'',
            s_img:'',
            s_time:'',
            s_con:'',
            news_id:''
        };
    }

    componentWillMount() {
        var that = this;
        var navsId = this.props.params.navsId;
        function ajax(num){
                $.ajax({  
                  type: 'GET',  
                  url: 'http://api.dagoogle.cn/news/get-news',
                  data:{
                    tableNum:num,
                    pagesize:40
                  },
                  async:false,
                  dataType:'jsonp', //告诉Ajax调用$jsonp  
                  success: function(news){  
                      // var yy=JSON.stringify(data);  
                      //var tlist=JSON.stringify(data.enttityList);  
                      //console.log(tlist);  
                      //console.log(this.state.title+'22');
                      var con_title = [];
                      var con_img = [];
                      var con_time = [];
                      var con_con = [];
                      var news_id = [];
                      for(var i=0;i<news.data.length;i++){
                        con_title.push(news.data[i].title)
                        con_img.push(news.data[i].top_image)
                        con_time.push(getLocalTime(news.data[i].edit_time))
                        con_con.push(news.data[i].content)
                        news_id.push(news.data[i].news_id)
                      }
                      that.setState({ s_title:con_title,s_img:con_img,s_time:con_time,s_con:con_con,news_id:news_id});
                      //var commentsStr=JSON.stringify(this.state.comments);  
                      //console.log("\n--->>commentsStr:\n"+commentsStr); //查看获取的数据  
                     
                  }
            });  
        }
        ajax(navsId);
        
    }
    render() {
        var num = parseInt(this.props.params.newsId);
        var tableNum = parseInt(this.props.params.navsId);
        var newsTitle = this.props.params.newsTitle;
        var newsId = this.props.params.news_id;
        var l_num = [];
        for(var i=0;i<5;i++){
            l_num.push(<Touchable
                     touchClass="touchable-highlight"
                    onTap={()=> {
                        yoHistory.push(`/detail/${num+i-4}/${tableNum}/${this.state.s_title[num+i-4]}/${this.state.news_id[num+i-4]}`);
                    }}
                >
                    <li><img src={this.state.s_img[num+i+1]} class="s-img"/><p style="padding:3%;" class="t_1">{this.state.s_title[num+i+1]}</p></li>
                </Touchable>)

        }
        return (

            <div className="yo-flex">

                <Header title="网易新闻" right={{ title: '跟帖', onTap: () => yoHistory.push(`/comment/${newsTitle}/${tableNum}/${newsId}`) }} left={{ title: '&#xf07d;',onTap: () => yoHistory.push('/list') }}/>
                <Scroller extraClass="flex" onScroll={() => {
                }}>
                    <div className="yo-list">
                        {
                            new Array(1).fill('').map((item, index) =>
                                <div className="" key={index}>
                                    <h1 class="b_title">{newsTitle}</h1>
                                    
                                    
                                    <div dangerouslySetInnerHTML={{__html:this.state.s_con[num]}} class="b_con"/>
                                    <p style="color:red;padding:20px;font-size:18px;">相关推荐</p>
                                    <ul class="t_link">
                                        {l_num}
                                    </ul>
                                </div>
                            )
                        }
                    </div>
                </Scroller>
            </div>
        )
    }
}
function getLocalTime(nS) { 
   return new Date(parseInt(nS) * 1000).toLocaleString().replace(/:\d{1,2}$/,' ');     
}
export default DetailPage;
